<#assign ctx=springMacroRequestContext.contextPath/>
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="format-detection" content="telephone=no">
    <link rel="stylesheet" href="${ctx}/plugin/layui/css/layui.css"/>
    <link rel="stylesheet" href="${ctx}/plugin/layer/theme/default/layer.css"/>
    <link rel="stylesheet" href="${ctx}/plugin/ztree/css/zTreeStyle/zTreeStyle.css" type="text/css">
    <link rel="stylesheet" href="${ctx}/styles/style.css"/>
    <link rel="stylesheet" href="${ctx}/styles/data.css"/>
</head>
<body>
<input id="basePath" type="hidden" value="${ctx}"/>
<div class="root">
    <div class="topbar">
        <div class="topbar-menu">
            <a href="javascript:toPage('root')" class="topbar-menu-item">
                <img src="${ctx}/image/menu01.png"/><span>连接</span>
            </a>
            <a href="javascript:toPage('data')" class="topbar-menu-item curr">
                <img src="${ctx}/image/menu02.png"/><span>数据</span>
            </a>
            <a href="javascript:toPage('info')" class="topbar-menu-item">
                <img src="${ctx}/image/menu03.png"/><span>信息</span>
            </a>
            <a href="javascript:toPage('conf')" class="topbar-menu-item">
                <img src="${ctx}/image/menu04.png"/><span>配置</span>
            </a>
            <a href="javascript:toPage('self')" class="topbar-menu-item">
                <img src="${ctx}/image/menu05.png"/><span>关于</span>
            </a>
        </div>
        <div class="topbar-logo"><img src="${ctx}/image/page-logo.png"/></div>
    </div>
    <div class="handle">
        <div class="handle-left">
            <div class="key-like">
                <input id="key-like-input" class="query-like-input" onkeypress="keydownLoadTree()"
                       type="text" placeholder="请输要检索的key表达式">
                <button class="layui-btn layui-btn-sm query-like-button set-color" onclick="loadPatternTree()">
                    <i class="layui-icon">&#xe615;</i>搜索
                </button>
            </div>
            <div class="key-tree">
                <ul id="keyTree0" name="keyTree0" class="ztree"></ul>
                <ul id="keyTree1" name="keyTree1" class="ztree"></ul>
                <ul id="keyTree2" name="keyTree2" class="ztree"></ul>
                <ul id="keyTree3" name="keyTree3" class="ztree"></ul>
                <ul id="keyTree4" name="keyTree4" class="ztree"></ul>
                <ul id="keyTree5" name="keyTree5" class="ztree"></ul>
                <ul id="keyTree6" name="keyTree6" class="ztree"></ul>
                <ul id="keyTree7" name="keyTree7" class="ztree"></ul>
                <ul id="keyTree8" name="keyTree8" class="ztree"></ul>
                <ul id="keyTree9" name="keyTree9" class="ztree"></ul>
                <ul id="keyTree10" name="keyTree10" class="ztree"></ul>
                <ul id="keyTree11" name="keyTree11" class="ztree"></ul>
                <ul id="keyTree12" name="keyTree12" class="ztree"></ul>
                <ul id="keyTree13" name="keyTree13" class="ztree"></ul>
                <ul id="keyTree14" name="keyTree14" class="ztree"></ul>
                <ul id="keyTree15" name="keyTree15" class="ztree"></ul>
            </div>
        </div>
        <div class="handle-right">
            <div class="key-deal">
                <!--
                <input id="key-input" class="query-input" type="text" placeholder="请输要检索的key">
                <button class="layui-btn layui-btn-sm query-button set-color" onclick="selectKey()">
                    <i class="layui-icon">&#xe615;</i>搜索
                </button>
                -->
                <button class="layui-btn layui-btn-primary layui-btn-sm set-color" onclick="renameKey()">
                    <i class="layui-icon">&#xe642;</i>重命名
                </button>
                <button class="layui-btn layui-btn-primary layui-btn-sm set-color" onclick="deleteKey()">
                    <i class="layui-icon">&#xe640;</i>删除
                </button>
                <button class="layui-btn layui-btn-primary layui-btn-sm set-color" onclick="retimeKey()">
                    <i class="layui-icon">&#xe60e;</i>TTL
                </button>
                <button class="layui-btn layui-btn-primary layui-btn-sm set-color" onclick="reloadKey()">
                    <i class="layui-icon">&#xe666;</i>刷新
                </button>
            </div>
            <div class="key-info">
                <table class="layui-table">
                    <colgroup>
                        <col width="150">
                        <col>
                    </colgroup>
                    <tbody>
                    <tr>
                        <td>key</td>
                        <td><span id="key"></span></td>
                    </tr>
                    <tr>
                        <td>类型</td>
                        <td><span id="type"></span></td>
                    </tr>
                    <tr>
                        <td>大小</td>
                        <td><span id="size"></span></td>
                    </tr>
                    <tr>
                        <td>TTL</td>
                        <td><span id="ttl"></span></td>
                    </tr>
                    </tbody>
                </table>
                <div class="key-vals">
                    <div class="key-vals-view">
                        <form class="layui-form" action="">
                            <div class="layui-col-md2 my-layui-col">
                                <input type="radio" lay-filter="vals" name="vals" value="1" title="text" checked>
                            </div>
                            <div class="layui-col-md2 my-layui-col">
                                <input type="radio" lay-filter="vals" name="vals" value="2" title="json">
                            </div>
                            <div class="layui-col-md2 my-layui-col">
                                <input type="radio" lay-filter="vals" name="vals" value="3" title="raws">
                            </div>
                            <div class="layui-col-md2 my-layui-col">
                                <input type="radio" lay-filter="vals" name="vals" value="4" title="edit">
                            </div>
                            <div class="layui-col-md4"></div>
                        </form>
                    </div>
                <#--<div class="key-vals-text">value</div>-->
                    <div id="vals1" class="vals key-vals-show"></div>
                    <div id="vals2" class="vals key-vals-hide"></div>
                    <div id="vals3" class="vals key-vals-hide"></div>
                    <div id="vals4" class="vals key-vals-hide"></div>
                </div>
            </div>
        </div>
    </div>
    <div class="status">
        <div class="status-message">
            <img src="${ctx}/image/${marktip}.png"/>
            <span class="conn ${marktip}">${message}</span>
        </div>
        <div class="status-version">${version}</div>
    </div>
</div>
</div>
<script type="text/javascript" src="${ctx}/plugin/jquery/jquery-1.9.1.js"></script>
<script type="text/javascript" src="${ctx}/plugin/layui/layui.js"></script>
<script type="text/javascript" src="${ctx}/plugin/layer/layer.js"></script>
<script type="text/javascript" src="${ctx}/plugin/ztree/zTree.js"></script>
<script type="text/javascript" src="${ctx}/script/script.js"></script>
<script type="text/javascript" src="${ctx}/script/json.js"></script>
<script type="text/javascript" src="${ctx}/script/data.js"></script>
</body>
</html>